#animated_div {
    animation: 5s ease 0s normal none 1 animated_div;
    background: none repeat scroll 0 0 #92b901;
    border-radius: 50%;
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    padding: 20px;
    position: relative;
    height: 60px;
    width: 60px;
}
@keyframes animated_div {
0% {
    left: 0;
    transform: rotate(0deg);
}
25% {
    left: 0;
    transform: rotate(20deg);
}
50% {
    left: 500px;
    transform: rotate(0deg);
}
55% {
    left: 500px;
    transform: rotate(0deg);
}
70% {
    background: none repeat scroll 0 0 #1ec7e6;
    left: 500px;
    transform: rotate(0deg);
}
100% {
    left: 0;
    transform: rotate(-360deg);
}
}
@keyframes animated_div {
0% {
    left: 0;
    transform: rotate(0deg);
}
25% {
    left: 0;
    transform: rotate(20deg);
}
50% {
    left: 500px;
    transform: rotate(0deg);
}
55% {
    left: 500px;
    transform: rotate(0deg);
}
70% {
    background: none repeat scroll 0 0 #1ec7e6;
    left: 500px;
    transform: rotate(0deg);
}
100% {
    left: 0;
    transform: rotate(-360deg);
}
}